import router from "./index";
import store from "@/store";
import token from "@/utils/token";
import { Message } from "element-ui";
import { routes, asyncRoutes } from "./index";

// 过滤路由
const filterRouting = (roles) => {
  // 获取角色名字
  const role = roles[0].name;
  // 如果是admin
  if (role === 'administrator') {
    routes[2].children.push(...asyncRoutes);
  } else {
    // 判断动态路由mata有角色的路由
    asyncRoutes.forEach((value) => {
      if (value.meta.roles) {
        if (value.meta.roles.includes(role)) {
          routes[2].children.push(value);
        }
      }
    });
  }
};

// 路由拦截
router.beforeEach(async (to, from, next) => {
  /* 路由发生变化修改页面title */
  if (to.meta.title) {
    document.title = to.meta.title;
  }
  // 有token的情况（其实可以不用判断token，直接用角色来判断）
  if (token.getSessionToken()) {
    // 判断角色
    let roles = store.getters.roles;
    // 没有角色才去获取
    if (roles.length === 0) {
      await store.dispatch("userinfo");
      // action后更新
      roles = store.getters.roles;
      // 过滤获得动态路由数组(这里的asyncRoutes其实是本地的，异步会用promise)
      filterRouting(roles);
      // 添加动态路由
      console.log('routes', routes);
      router.$addRoutes(routes);
      // routes.forEach((value) => {
      //   router.addRoute(value);
      // });
      // 路由信息保存到vuex（导航栏要匹配）
      store.commit('ROUTES', routes)
      next(to.path) // 防f5刷新丢失路由
    }
    if (roles.length > 0) {
      // 有token和角色的情况下访问login跳向index
      if (to.path === "/login") {
        next("index");
      } else {
        // 正常访问其他路径
        next();
      }
    } else {
      // 没有角色权限：非法登陆
      token.removeSessionToken(); // 在有token却无权限的情况下清空token
      next("/login");
      Message({
        message: "未登陆，无权限访问",
        type: "error",
      });
    }
  }
  // 没有token的情况
  else {
    // 没有token的情况下可以访问login
    if (to.path === "/login") {
      next();
    } else {
      // 没有token：非法登陆
      next("/login");
      Message({
        message: "未登陆，无权限访问",
        type: "error",
      });
    }
  }
});